<template>
  <!-- 注意:input双向绑定的value的默认类型是string -->
  <!-- .numder可以将非数值类型转换为数值类型 -->
  <div>
    年龄: <input type="text" v-model.number="age" />
    <hr />
    <!-- .trim可以去除首尾空格 -->
    人生格言: <input type="text" v-model.trim="motto" />
    <hr />
    <!-- .lazy 在change时触发,而非在input时触发,在失去焦点时同步数据到VUE变量-->
    自我介绍:
    <textarea name="" id="" cols="30" rows="10" v-model.lazy="intro"></textarea>
  </div>
</template>

<script>
export default {
  data() {
    return {
      age: 0,
      motto: "",
      intro: "",
    };
  },
};
</script>

<style>
</style>